let items = document.querySelectorAll(".item");
let colors = ["#3496d9", "#2fbc69", "#e17c22", "#7a3d91"];
items.forEach((item, idx) => {
  item.addEventListener("mouseenter", () => {
    let idx = Math.floor(Math.random() * 4);
    let shadow = colors[idx] + "40";
    item.style.transition = "none";
    item.style.backgroundColor = colors[idx];
    item.style.boxShadow = "0 0 30px 12px " + shadow;
    item.style.zIndex = 5;
  });
  item.addEventListener("mouseleave", () => {
    item.style.transition = "all 2s ease";
    setTimeout(() => {
      item.style.boxShadow = "none";
      item.style.backgroundColor = "#1d1d1d";
      item.style.zIndex = 1;
    }, 1000);
  });
});
